<template>
    <div class="ke-admin">
        <div class="ke-admin-sidebar">
            <div class="ke-admin-sidebar-title">
                {{ vars.title }}
            </div>

            <div class="ke-admin-sidebar-body">
                <ul class="ke-admin-menu" v-if="vars.menus">
                    <li v-for="(item, idx) in vars.menus.side" :key="idx">
                        <a href="javscript:;" @click="onClickSide(item)">
                            <svg class="icon nav-icon left" aria-hidden="true">
                                <use :xlink:href="`#${item.icon}`"></use>
                            </svg>

                            <span class="text">{{ item.title }}</span>

                            <i :class="getNavClass(item)"></i>
                        </a>

                        <dl v-if="isShowSub(item)">
                            <dd v-for="(sub, subi) in item.children" :key="subi">
                                <a href="javascript:;">
                                    <span class="text">{{ sub.title }}</span>
                                </a>
                            </dd>
                        </dl>
                    </li>
                </ul>
            </div>
        </div>
        <div class="ke-admin-main">
            内容区
        </div>
    </div>
</template>
